<script lang="ts" setup>
import HeaderBar from './HeaderBar/index.vue'
import Navigation from './Navigation/index.vue'
import Breadcrumb from './Breadcrumb/index.vue'
</script>

<template>
  <a-layout class="h-[100vh] h-100dvh w-full text-arco-1">
    <a-layout-header border="b-1 arco-gray-3 b-solid" class="select-none">
      <HeaderBar />
    </a-layout-header>
    <a-layout overflow-hidden>
      <a-layout-sider style="width: auto"><Navigation class="h-full" /></a-layout-sider>
      <a-layout-content class="scrollbar-slim w-full pa-xs overflow-auto bg-arco-gray-2">
        <div class="flex flex-col h-full gap-y-2">
          <Breadcrumb />
          <RouterView />
        </div>
      </a-layout-content>
    </a-layout>
  </a-layout>
</template>
